import { NavBar } from 'antd-mobile'
import React from 'react'
import { Button, Space, Swiper, Toast } from 'antd-mobile'
import { TravelOutline } from 'antd-mobile-icons'
import { useNavigate } from 'react-router-dom'
import Web from '../../componenst/Web'
function index() {
    const nav=useNavigate()
    const colors = ['#ace0ff', '#bcffbd', '#e4fabd', '#ffcfac'] 
const items = colors.map((color, index) => (
  <Swiper.Item key={index}>
    <div 
      style={{ background: color,width:'100vw',height:'200px' }} 
    >
      {index + 1}
    </div>
  </Swiper.Item>
))
  return (
    <div>
        <NavBar backIcon={false}>首页</NavBar>
        <div> <Swiper loop autoplay>{items}</Swiper> </div>
        <div style={{display:'flex',justifyContent:'space-evenly'}}>
            <div onClick={()=>nav('/hcp')}><TravelOutline />火车票</div>
            <div><TravelOutline />火车票</div>
            <div><TravelOutline />火车票</div>
            <div><TravelOutline />火车票</div>
            <div><TravelOutline />火车票</div>
            <div><TravelOutline />火车票</div>
            <div><TravelOutline />火车票</div>
            <div><TravelOutline />火车票</div>
            <div><TravelOutline />火车票</div>
            <div><TravelOutline />火车票</div>
        </div>
    </div>
  )
}

export default  index